//1. 引入createRouter
import {createRouter, createWebHistory} from 'vue-router'
import Home from "@/pages/Home.vue";
import About from "@/pages/About.vue";
import Detail from "@/pages/Detail.vue";

//2.创建路由器
const router = createRouter({
    //createWebHashHistory 表示hash 模式
    //路由器工作模式：createWebHashHistory 表示 history模式
    // history: createWebHashHistory(),
    history: createWebHistory(),
    //配置路由规则
    routes: [ //一个一个的路由规则
        {
            path: '/',
            redirect: '/home' //访问 / 的时候重定向到 /about
        },
        {
            path: '/home',
            component: Home
        },
        {
            name: 'xinwen',
            path: '/news',
            component: () => import('@/pages/News.vue'),
            children: [
                {
                    name: 'xiang',
                    //子级路由不用写反斜杠.
                    path: 'detail',
                    component: Detail,
                    // props的函数写法，作用：把返回的对象中每一组key-value作为props传给Detail组件
                    props(route) {
                        return route.query;
                    }
                }
            ]
        },
        {
            path: '/about',
            component: About
        },
    ]
})

// 3.暴露出去router
export default router